<template>
  <div class="home">
    <img src="@/assets/images/home-bgc.jpg" class="home-bgc">
    <div class="home-content">
      <!-- 头部导航区域 -->
      <Masks></Masks>
      <!-- <Nav></Nav> -->
      <!-- 内容区域 -->
      <Content></Content>
      <!-- 登录框 -->
      <router-view></router-view>
      <el-backtop :bottom="150" :right="150">
        <div>
          <span class="iconfont icon-huidaodingbu" style="fontSize:26px;color:rgb(96, 56, 207)"></span>
        </div>
      </el-backtop>
    </div>
  </div>
</template>

<script>
// import Nav from '@/components/TopBar/Nav.vue'
import Masks from '@/components/TopBar/Masks.vue'
import Content from '@/components/Content/Content.vue'
export default {
  name: 'Home',
  components: {
    // Nav,
    Masks,
    Content
  }
}
</script>

<style lang="less" scoped>
.home {
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  // padding-top: 7.5%;
  overflow: auto;

  .home-bgc {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    // height: 100%;
    z-index: 1;
    filter: brightness(80%);
  }

  .home-content {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 5;
    // overflow: auto;
  }
}
</style>